<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<link title=style href="login.css" type=text/css rel=StyleSheet>
<link rel="shortcut icon" href="../favicon.ico"> 
<script type="text/javascript" src="/Yogiro/js/jquery.js"></script>

<script type="text/javascript">
$(document).ready(function(){
	var id = $("#loginId").val();
	if(id==""){
		document.cheekLogin.Username.focus();
	};
	$("#Login").on("click",function(){
	var id = $("#loginId").val();
	var password = $("#loginPwd").val();
		$.ajax({
			"url":"/Yogiro/member.do",
			"type":"post",
			"data":{"method":"loginSuccess", "id":$("#loginId").val(),"password":password},
			"dataType":"json",
			"beforeSend":function(){
				if(!$("#loginId").val()){
					alert("아이디를 입력하세요");
					document.cheekLogin.Username.focus();
					return false ;
				}
				if(!$("#loginPwd").val()){
					alert("비밀번호를 입력하십시오");
					document.cheekLogin.password.focus();
					return false ;
				}
				var con = confirm("로그인 하시겠습니까?");
				if(!con){
					return false;
				}
			},
			"success":function(mto){
				if(mto!=null){
					if(id==mto.memberId&&$("#loginPwd").val()==mto.memberPassword){
						alert(mto.memberName+"님 로그인 성공했습니다. ");
						location.href="member.do?method=login";
					}else{
						alert("비밀번호가 맞지 않습니다.");
					}
				}else{
				alert("없는 ID입니다.");
				}
			},
			"error":function(xhr, status, error){
				alert("실패: "+error);
			},
		});
	});
});
</script>
<script>
$(function(){
			    $(".showpassword").each(function(index,input) {
			        var $input = $(input);
			        $("<p class='opt'/>").append(
			            $("<input type='checkbox' class='showpasswordcheckbox' id='showPassword' />").click(function() {
			                var change = $(this).is(":checked") ? "text" : "password";
			                var rep = $("<input placeholder='Password' type='" + change + "' />")
			                    .attr("id", $input.attr("id"))
			                    .attr("name", $input.attr("name"))
			                    .attr('class', $input.attr('class'))
			                    .val($input.val())
			                    .insertBefore($input);
			                $input.remove();
			                $input = rep;
			             })
			        ).append($("<label for='showPassword'/>").text("Show password")).insertAfter($input.parent());
			    });

			    $('#showPassword').click(function(){
					if($("#showPassword").is(":checked")) {
						$('.icon-lock').addClass('icon-unlock');
						$('.icon-unlock').removeClass('icon-lock');    
					} else {
						$('.icon-unlock').addClass('icon-lock');
						$('.icon-lock').removeClass('icon-unlock');
					}
			    });
			});
</script>
<style>
	body {
		background: #e1c192 
		}
</style>
		
<div align="center" style="margin-top: 20px" id="successLogin">
<c:if test="${sessionScope.mto==null }">
<form name="cheekLogin" class="form-2">
<h1><span class="log-in">Log in</span> or <span class="sign-up">sign up</span></h1>
	<table>
		<tr class="float">
		<th>
		<label for="loginId"><i class="icon-user"></i>Username</label>
		<input type="text" name="Username" id="loginId" placeholder="Username">
		</th>
		</tr>
		<tr class="float">
		<th>
		<label for="loginPwd"><i class="icon-lock"></i>password</label>
		<input type="password" name="password" size="21" id="loginPwd" placeholder="password" class="showpassword">
		</th>
		</tr>
		<tr>
		<td colspan="2" align="right" class="clearfix"><input type="button" value="로그인" id="Login">
		<a href="member.do?method=showRegisterMember" class="loginform" style="background: #fbd568; border:1px solid #f4ab4c "><font color="#996319">회원가입</font></a>
		<a href="member.do?method=findMemberInfo&no=1" style="margin-left: 3px;font-style: oblique;color: #996319">아이디 찾기</a> / <a href="member.do?method=findMemberInfo&no=2" style="font-style: oblique; color: #996319">비밀번호 찾기</a>
		</td></tr>
	</table>
</form>
</c:if>

<c:if test="${sessionScope.mto!=null }">
<div align="left" style="padding: 10px" class="form-2">
<font style="font-size: 20px; font-weight: bold">${sessionScope.mto.memberName }님</font>
<a href="/Yogiro/member.do?method=myInfo" style="font-size: 12px; color: #996319;">내정보</a>
<a href="/Yogiro/member.do?method=logout" style="float: right;background: #fbd568; border:1px solid #f4ab4c; font-size: 13px; color: #996319;">로그아웃</a> 
<br><br>
<c:if test="${sessionScope.mto.memberLevel=='0' }">
<a href="message.do?method=listController" style="font-size: 14px; color: #996319;">쪽지함</a> | 
<a href="/Yogiro/member.do?method=selectMemberList" style="font-size: 14px; color: #996319;">전체회원정보</a> | 
</c:if>
<c:if test="${sessionScope.mto.memberLevel=='1' }">
<a href="message.do?method=ClientListController" style="font-size: 14px; color: #996319;">쪽지함</a> | 
</c:if>
<a href="/Yogiro/member.do?method=setInfo&Info=1" style="font-size: 14px; color: #996319;">자기정보수정</a>

<input type="hidden" name="method" value="setInfo">
<input type="hidden" name="Info" value="1">
</div>
</c:if>
</div>

